<md-table-container>
    <table id="node-image-list" md-table>
        <thead md-head>
        <tr md-row>
            <th md-column>ID</th>
            <th md-column>{/'Name' | translate/}</th>
            <th md-column>{/'Size' | translate/}</th>
            <th md-column>{/'Created At' | translate/}</th>
            <th md-column>{/'Operation' | translate/}</th>
        </tr>
        </thead>
        <tbody md-body>
        <tr md-row ng-repeat="image in nodeImageCtrl.images">
            <td md-cell>
                <a id="node-image-id-{/$index/}" class="ellipsis"
                   data-ui-sref="node.imageDetail({node_id: $stateParams.node_id, image_id: image.Id})">{/image.Id |
                    limitTo: ID_LIMIT_LENGTH/}
                    <md-tooltip md-direction="top">{/image.Id/}</md-tooltip>
                </a>
            </td>
            <td md-cell>
                <ul>
                    <li ng-repeat="tag in image.RepoTags">
                        <a id="node-image-name-{/$index/}" class="ellipsis"
                           data-ui-sref="node.imageDetail({node_id: $stateParams.node_id, image_id: image.Id})">{/tag/}
                            <md-tooltip md-direction="top">{/tag/}</md-tooltip>
                        </a>
                    </li>
                </ul>
            </td>
            <td md-cell>{/image.Size | size/}</td>
            <td md-cell>{/image.Created * 1000| date: 'yyyy-MM-dd HH:mm:ss'/}</td>
            <td md-cell>
                <md-button id="node-delete-image-{/$index/}" class="md-icon-button" aria-label="delete"
                           data-ng-click="nodeImageCtrl.deleteImage($stateParams.node_id, image.Id)">
                    <i class="fa fa-trash"></i>
                    <md-tooltip md-direction="left">{/'Remove image' | translate/}</md-tooltip>
                </md-button>
            </td>
        </tr>
        </tbody>
    </table>
</md-table-container>
